/**
 * Created by Administrator on 2017/3/21.
 */
import React, {Component} from 'react';
import { Form, Input, DatePicker, Select, Breadcrumb,  Divider } from 'antd';
import {connect} from 'dva';
import 'braft-editor/dist/index.css'
import Zmage from 'react-zmage';
import request from '@/utils/request';
import party_top from '../../images/party_top.jpg';
import styles from './homePage.less';

class AddPoliciesForm extends Component {
  constructor(props) {
    super(props);
    this.state = {
      all_roles:[],
      html:'',
      data:{}
    };
  }
  componentDidMount() {

    const that=this;
    console.log(this.props.history.location)
    const pathname =this.props.history.location.pathname
    request(`/articles/${pathname.split('/')[pathname.split('/').length-1]}`, {
      method: 'GET',
    }).then((response) => {
      if (response.status === 200) {
        that.setState({
          data:response.data.data
        });
      }
    });
  }
  renderType=(value)=>{
    let map=[{id:'1',name:'首页轮播'},{id:'2',name:'党建动态'},{id:'3',name:'时事要闻'},{id:'4',name:'活动会议'},{id:'5',name:'主题党日'},
      {id:'6',name:'支部荣誉'},{id:'7',name:'党员风采'},{id:'8',name:'学习内容'}];
    for(let i=0;i<map.length;i++){
      if(value===map[i].id){
        return map[i].name
      }
    }
  }
  render() {



    return (
      <div style={{width:'100%',minHeight:'100vh',background:'#f0f2f5'}}>
        <div
          style={{ display:'flex',minHeight:'100vh',background:'#fff',flexDirection:'column',overflow: 'auto',
            maxWidth: 1070, margin: '0 auto' }}>
          <div>
            <img style={{ width: '100%', height: 'auto' }} src={party_top} alt=""/>
          </div>
          <div style={{fontSize:'16px',padding:'10px 20px',color:'#333'}}>
            <span onClick={()=>{
              window.open(`http://${window.location.host}/party_home`);
            }} className={styles.hover}>首页</span>
            <span> > </span>
            <span onClick={()=>{
              window.open(`http://${window.location.host}/party_list/${this.state.data.type[0]}`);
            }} className={styles.hover}>{this.state.data.type&&this.renderType(this.state.data.type[0])}</span>
            <span> > </span>
            <span style={{fontWeight:'bold'}}> {this.state.data.title} </span>
          </div>
          <h2 style={{width:'80%',margin:'5px auto',textAlign:'center',fontWeight:'bold',fontSize:'30px'}}>{this.state.data.title}</h2>
          <div  style={{width:'90%',margin:'5px auto',fontSize:'16px',color:'#333'}}>
            <span style={{marginRight:'12px'}}>{this.state.data.date}</span>
            {
              this.state.data.reprinted_source?
                <span >来源 : {this.state.data.reprinted_source}</span>:''
            }
            <Divider style={{marginTop:'5px',marginBottom:'5px'}}/>
          </div>

          <div   className="detailImgWrap"  style={{flex:'1',
            padding:'10px 20px',fontSize:'16px'}}
                 dangerouslySetInnerHTML={{ __html:this.state.data.content}}></div>
        </div>

      </div>
    );
  }
}

const AddPoliciesFormWrap = Form.create()(AddPoliciesForm);
export default connect()(AddPoliciesFormWrap);


